<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
	<title>Arc 成绩计算</title>
	<link rel="stylesheet" type="text/css" href="static/lib/fomantic-ui/dist/semantic.min.css">
	<link rel="stylesheet" type="text/css" href="static/lib/noty/noty.css">
	<link rel="stylesheet" type="text/css" href="static/lib/noty/themes/semanticui.css">
	<link rel="stylesheet" type="text/css" href="static/index.css">
	<script src="js/frame.js"></script>
	<script src="js/base64.js"></script>
	<script src="js/save.js"></script>
	<script type="text/javascript">
		var nowactive='index';
		var searchlink='https://wiki.arcaea.cn/index.php?title=%E7%89%B9%E6%AE%8A:%E6%90%9C%E7%B4%A2&search=';
		function settab(a,b){
			var list=document.getElementById('menu').children;
			for(var i=0;i<list.length;++i) list[i].className='item';
			list[a].className='active item';
			document.getElementById(nowactive).className='ui tab';
			document.getElementById(b).className='ui tab active';
			nowactive=b;
		}
	</script>
	<script src="js/upload.js"></script>
	<style>
		p{display: inline;}
	</style>
</head>
<body>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
	<div class="wide column" style="display: inline-block;width: 40em;">	
						<h4 class="ui top attached block header">更新提示</h4>
						<div class="ui bottom attached segment"><form class="ui form">
							新版本已经在 <a href="https://wyxkk.gitee.io/arcaea-card-new/">https://wyxkk.gitee.io/arcaea-card-new/</a> 开放！<br>
							若要导出当前存档信息到新版本，请在旧版本导出存档后，粘贴至 <a href="https://wyxkk.gitee.io/arcaea-card-new/fixold.html">https://wyxkk.gitee.io/arcaea-card-new/fixold.html</a> 的输入框内，然后点击转换按钮，再把框内的内容复制粘贴至新版导入。<br>
							由于技术原因，一部分记录无法转换，请自行检查并补全。
						</form></div>
					</div>
	<div class="ui main container" style="margin-top:2em;margin-left:2em;">
		<div class="ui borderless history menu" style="width:30em;" id="menu">
			<a class="active item" onclick="settab(0,'index')">首页</a>
			<a class="item" onclick="settab(1,'songupload')">谱面信息管理</a>
			<a class="item" onclick="settab(2,'playupload')">记录管理</a>
			<a class="item" onclick="settab(3,'save')">存档管理</a>
			<a class="item" onclick="settab(4,'other')">其他</a>
		</div>
		<div class="ui tab active" id="index">
			<div class="ui column grid">
				<div class="column">
					<div class="twenty wide column" style="width:95.5em;">
						<h4 class="ui top attached block header">成绩排行</h4>
						<div class="ui bottom attached segment" id="all"></div>
					</div>
				</div>
				<div class="column">
					<div class="wide column" style="display: inline-block;width: 20em;margin-left:91em;">	
						<h4 class="ui top attached block header">信息</h4>
						<div class="ui bottom attached segment"><form class="ui form">
							<div style="margin-bottom: 0.7em;">
								<p>您当前的潜力值：</p>
								<div class="rating-small rating-badge-0" id="ptt" style="vertical-align: middle;">
								<span><span class="hi" id="ptthi">0.</span><span class="lo" id="pttlo">00</span></span>
								</div>
								<p style="font-style: italic;font-size: 0.75em;" id="pttext">0.00000</p>
							</div>
							<p>最近一次录入的游玩：</p><br><br>
							<div id="recent" style="margin-bottom:-2em;"></div>
						</form></div>
					</div>
				</div>
			</div>
		</div>
		<div class="ui tab" id="songupload">
			<div class="ui two column grid">
				<div class="column">
					<div class="wide column" style="width:39em;display: inline-block;">
						<h4 class="ui top attached block header">谱面信息录入</h4>
						<div class="ui bottom attached segment"><form class="ui form">
							<p>*若已经存在，会<strong>覆盖</strong>同一曲目的同一难度的信息</p>
							<div class="field"><label>曲目全名</label><input type="text" placeholder="Aegleseeker" id="songtitlea"></div>
							<p>难度：</p>
							<input type="radio" name="diffa" value=0><strong style="color:blue;">PST</strong>
							<input type="radio" name="diffa" value=1><strong style="color:green;">PRS</strong>
							<input type="radio" name="diffa" value=2 checked="checked"><strong style="color:purple;">FTR</strong>
							<input type="radio" name="diffa" value=3><strong style="color:red;">BYD</strong><br>
							可以<a href='https://wiki.arcaea.cn/index.php?title=%E7%89%B9%E6%AE%8A:%E6%90%9C%E7%B4%A2&search=' id='search' target="_blank">在 wiki 上搜索</a>获得结果。<br>
							<div class="two fields">
								<div class="field"><label>物量：</label><input type="text" placeholder="1568" id="note"></div>
								<div class="field"><label>定数：</label><input type="text" placeholder="11.0" id="rank"></div><br>
							</div>
							<div class="ui blue submit button" onclick="uploadsong()">添加谱面信息</div>
						</form></div>
					</div>
				</div>
				<div class="column">
					<div class="wide column" style="width:39em;display: inline-block;">
						<h4 class="ui top attached block header">谱面信息删除</h4>
						<div class="ui bottom attached segment"><form class="ui form">
							<strong style="color: red;">会同时删除本谱面下的记录，且删除后无法恢复！</strong>
							<div class="field"><label>曲目全名</label><input type="text" placeholder="Aegleseeker" id="songtitleb"></div>
							<p>难度：</p>
							<input type="radio" name="diffb" value=0><strong style="color:blue;">PST</strong>
							<input type="radio" name="diffb" value=1><strong style="color:green;">PRS</strong>
							<input type="radio" name="diffb" value=2 checked="checked"><strong style="color:purple;">FTR</strong>
							<input type="radio" name="diffb" value=3><strong style="color:red;">BYD</strong><br>
							<div class="ui red submit button" onclick="delsong()">删除谱面信息</div>
						</form></div>
					</div>
				</div>
			</div><br>
			<div class="wide column" style="width:78em;display: inline-block;">
				<h4 class="ui top attached block header"><div class="content">已有谱面信息（按字典序排序）</div></h4>
				<div class="ui bottom attached styled songs accordion"><form class="ui form" id='songcur'>
				</form></div>
			</div>
		</div>
		<div class="ui tab" id="playupload">
			<div class="ui two column grid">
				<div class="column">
					<div class="wide column" style="width:39em;display: inline-block;">
						<h4 class="ui top attached block header">成绩录入</h4>
						<div class="ui bottom attached segment"><form class="ui form">
							<div class="field"><label>曲目全名（可以通过<a href='https://wiki.arcaea.cn/index.php?title=%E7%89%B9%E6%AE%8A:%E6%90%9C%E7%B4%A2&search=' id='searcha' target="_blank">在 wiki 上搜索</a>得到）</label><input type="text" placeholder="Aegleseeker" id="songtitle"></div>
							<p>难度：</p>
							<input type="radio" name="diff" value=0><strong style="color:blue;">PST</strong>
							<input type="radio" name="diff" value=1><strong style="color:green;">PRS</strong>
							<input type="radio" name="diff" value=2 checked="checked"><strong style="color:purple;">FTR</strong>
							<input type="radio" name="diff" value=3><strong style="color:red;">BYD</strong><br>
							<div class="three fields">
								<div class="field"><label><strong style="color:#dd4444;">LOST</strong><p>个数：</p></label><input type="text" placeholder="0" id="mis"></div>
								<div class="field"><label><strong style="color:#ffaa11;">FAR</strong><p>个数：</p></label><input type="text" placeholder="0" id="far"></div>
								<div class="field"><label><strong style="color:#cc22ee;">MAXPURE</strong><p>个数：</p></label><input type="text" placeholder="1568" id="mxp"></div><br>
							</div>
							<div class="ui blue submit button" onclick="uploadplay()">添加记录</div>
						</form></div>
					</div>
				</div>
				<div class="column">
					<div class="wide column" style="width:39em;display: inline-block;">
						<h4 class="ui top attached block header">成绩删除</h4>
						<div class="ui bottom attached segment"><form class="ui form">
							<strong style="color: red;">如此操作会删除此谱面下的记录，且无法恢复！</strong>
							<div class="field"><label>曲目全名</label><input type="text" placeholder="Aegleseeker" id="songtitlec"></div>
							<p>难度：</p>
							<input type="radio" name="diffc" value=0><strong style="color:blue;">PST</strong>
							<input type="radio" name="diffc" value=1><strong style="color:green;">PRS</strong>
							<input type="radio" name="diffc" value=2 checked="checked"><strong style="color:purple;">FTR</strong>
							<input type="radio" name="diffc" value=3><strong style="color:red;">BYD</strong><br>
							<div class="ui red submit button" onclick="delplay()">删除记录</div>
						</form></div>
					</div>
				</div>
			</div>
		</div>
		<div class="ui tab" id="save">
			<div class="ui column grid" style="width: fit-content;">
				<div class="column">
					<div class="wide column" style="width:39em;display: inline-block;">
						<h4 class="ui top attached block header">导出当前存档</h4>
						<div class="ui bottom attached segment"><form class="ui form">
							<p>将导出的字符串在其他地方导入即可转移存档。</p>
							<textarea rows="10" id="rawoutput" style="margin-bottom: 1em;margin-top: 1em;"></textarea>
							<div class="ui blue submit button" onclick="outersave()">导出</div>
						</form></div>
					</div>
				</div>
				<div class="column">
					<div class="wide column" style="width:39em;display: inline-block;margin-left: 35em;">
						<h4 class="ui top attached block header">导入至当前存档</h4>
						<div class="ui bottom attached segment"><form class="ui form">
							<strong style="color: red;">导入将覆盖你的当前存档！建议导入前先导出当前存档！</strong>
							<textarea rows="10" id="rawinput" style="margin-bottom: 1em;margin-top: 1em;"></textarea>
							<div class="ui red submit button" onclick="outerload()">导入</div><br>
						</form></div>
					</div>
				</div>
				<div class="column">
					<div class="wide column" style="width: 11.3em;display: inline-block;margin-left: 70em;margin-top: 0em;">
						<h4 class="ui top attached block header">清空当前存档</h4>
						<div class="ui bottom attached segment"><form class="ui form" style="margin-bottom: 0em;">
							<div class="ui red submit button" onclick="clearsave()">清空当前存档</div>
						</form></div>
					</div>
				</div>
			</div><br>
			<div class="ui two column grid" style="width: fit-content;">
				<div class="column">
					<div class="wide column" style="width:39em;display: inline-block;">
						<h4 class="ui top attached block header">其它存档位</h4>
						<div class="ui bottom attached segment"><form class="ui form">
							<p>可以将当前存档导出至其他存档位，或从其他存档位导入到当前存档。</p><br>
							<p>导出至不存在的存档位时，对应存档位会被创建；从不存在的存档位导入时无效果。</p><br>
							<strong style="color:red">导出至已存在的存档位会对后者进行覆盖！</strong>
							<div class="field"><label>存档位名称</label><input type="text" placeholder="Slot name" id="slot"></div>
							<div class="ui red submit button" onclick="innersave()">导出至此存档位</div>
							<div class="ui red submit button" onclick="innerload()">从此存档位导入</div>
							<div class="ui red submit button" onclick="innerdel()">删除此存档位</div>
						</form></div>
					</div>
				</div>
				<div class="column">
					<div class="wide column" style="width:39em;display: inline-block;margin-left: -0.5em;">
						<h4 class="ui top attached block header">已有存档位</h4>
						<div class="ui bottom attached segment" id="othersavelist"></div>
					</div>
				</div>
			</div>
		</div>
		<div class="ui tab" id="other">
			<div class="ui two column grid">
				<div class="wide column" style="width:42em;display: inline-block;">
					<h4 class="ui top attached block header">图例</h4>
					<div class="ui bottom attached segment"><form class="ui form" style="margin-bottom: 0em;">
						<div class="ui cards" style="display:inline-block;margin-top:0em;margin-bottom:0.4em;margin-right:0.33em;"><div class="record card"><div class="content"><div class="header"><div class="title">LunarOrbit -believe in the Espebranch road-</div><span class="ui purple horizontal label">FTR 9</span></div><div class="description"><div class="ui very compact grid"><div class="row"><div class="score"><span class="score">09'944'237</span><span class="chart-ptt"> / 9.6 / 11.32118</span></div></div><div class="row"><div class="three wide rank column">EX+</div><div class="nine wide details column"><div class="ui very compact grid"><div class="row">P: 1047 (+948)</div><div class="equal width row"><div class="column">F: 10</div><div class="column">L: 1</div></div></div></div><div class="three wide rank column">#4</div></div></div></div></div></div></div>
						<div class="ui cards" style="display:inline-block;margin-top:-1.5em;margin-bottom:0.4em;margin-right:0.33em;"><div class="record card"><div class="content"><div class="header"><div class="title">Aegleseeker</div><span class="ui green horizontal label">PRS 8</span></div><div class="description"><div class="ui very compact grid"><div class="row"><div class="score"><span class="score">09'745'962</span><span class="chart-ptt"> / 8.8 / 9.61987</span></div></div><div class="row"><div class="three wide rank column">AA</div><div class="nine wide details column"><div class="ui very compact grid"><div class="row">P: 1186 (+1023)</div><div class="equal width row"><div class="column">F: 35</div><div class="column">L: 14</div></div></div></div><div class="three wide rank column">REC</div></div></div></div></div></div></div><br>
						第一行：左侧为曲名，过长时会省略后面的部分；右侧为难度和标级。<br>
						第二行：左侧为分数；中间为谱面定数；右侧为游玩 ptt。<br>
						第三行：左侧为评级；中间上方为 <strong style="color:#cc22ee;">PURE</strong> 个数和 <strong style="color:#cc22ee;">MAXPURE</strong> 个数；中间下方为 <strong style="color:#ffaa11;">FAR</strong> 个数和 <strong style="color:#dd4444;">LOST</strong> 个数；右侧为其游玩 ptt 的排名，或表示这指最近游玩。
					</form></div>
				</div>
				<div class="wide column" style="width:36em;display: inline-block;">
					<h4 class="ui top attached block header">关于</h4>
					<div class="ui bottom attached segment"><form class="ui form" style="margin-bottom: 0em;">
						<p>所有数据存储于本地（浏览器的 localStorage）。</p><br>
						<p>此处潜力值的计算方式为 (b30+b10)/40，（可能为？）不推分时能达到的最高值。</p><br>
						<p>Written by WYXkk</p><br>
						<p>Semantic UI 永远滴神</p><br>
						<p>您可能需要调整页面大小以看到完整页面。</p>
					</form></div>
				</div>
			</div>
		</div>
	</div>
	<script type="text/javascript">load();show();</script>
	<script type="text/javascript">
		document.getElementById("songtitle").addEventListener("input", function(){
			document.getElementById("searcha").href=searchlink+document.getElementById("songtitle").value;
		});
		document.getElementById("songtitlea").addEventListener("input", function(){
			document.getElementById("search").href=searchlink+document.getElementById("songtitlea").value;
		});
	</script>
</body>
</html>